<template>
<view class="container">
  <view class="list" v-if="list.length > 0">
    <view class="box" v-for="(item,i) in list">
      <view class="left">
        <view class="p1">{{ item.createTime.split(' ')[0] }}</view>
        <view class="p2">{{ item.createTime.split(' ')[1] }}</view>
      </view>
      <view class="right">
        <view class="p1">
          {{ getStatus(item.status) }}
        </view>
        <view class="p2">兑换BPW数量{{ item.applyNum }}</view>
        <view class="p2">消耗股权份额{{ getNumTimes(item.applyNum,10) }}</view>
      </view>
    </view>
  </view>

  <u-loadmore :status="status" />
  <empty v-if="list.length == 0" :isLoading="false" :custom-style="{ padding: '180rpx 50rpx' }" tips="暂无数据" />
</view>
</template>

<script>
import {numTimes} from '@/core/app'
export default {
  data(){
    return{
      list:[],
      page:1,
      size:10,
      status: 'loadmore',
    }
  },
  onPullDownRefresh(){
    this.page = 1;
    this.getList();
  },
  onReachBottom(){
    if(this.status == 'nomore') return;
    this.page++;
    this.status = 'loading';
    this.getList();
  },
  onLoad(){
    this.getList()
  },
  methods:{
    getNumTimes(val1,val2){
      return numTimes(val1,val2);
    },
    getList(){
      const app = this
      let params = {
        page:app.page,
        size:app.size
      }
      app.$request.get('wx/share/applyList',params).then(({data}) => {
        if(data.total/app.size <=app.page){
          app.status = 'nomore';
        }
        app.list = app.page == 1 ? data.items : app.list.concat(data.items);
      }).catch(err=>{
        app.$toast(err.errmsg)
      })
    },
    getStatus(status){
      switch(status){
        case 1:
          return '新建'
        case 2:
          return '成功'
        case 3:
          return '失败'
        default:
          return '新建'
      }
    },
  }
}
</script>

<style scoped lang="scss">
.container{
  padding:  40rpx;
  background: #F7F7F7;
  min-height: 100vh;
  box-sizing: border-box;
  .box{
    border-radius: 10rpx;
    background: #FFF;
    padding: 26rpx 24rpx;
    margin-bottom: 20rpx;
    display: flex;
    align-items: flex-start;
    gap:40rpx;
    .left{
      .p1{
        color:#242323;
        font-weight: 500;
        font-size: 27rpx;
      }
      .p2{
        color:#6F6F6F;
        font-weight: 500;
        font-size: 24rpx;
        margin-top: 10rpx;
      }
    }
    .right{
      .p1{
        font-size: 28rpx;
        font-weight: 400;
        color: #010812;
      }
      .p2{
        margin-top: 14rpx;
        font-size: 24rpx;
        font-weight: 400;
        color: #3D3D3D;
      }
    }
  }
}
</style>